
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Follow Peers</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }
    </style>
   

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
  </head>

  <body>

    <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          <a class="brand" href="index.html">Follow Peers</a>
          <div class="nav-collapse collapse">
            <form class="navbar-form pull-right">
              <input class="span2" type="text" placeholder="Email">
              <input class="span2" type="password" placeholder="Password">
              <button type="submit" class="btn">Sign in</button>
            </form>
          </div><!--/.nav-collapse -->
        </div>
      </div>
    </div>

    <div class="container">

      <div class="row" style="margin-top:20px;">
      	<div class="span8">
      		<div id="myCarousel" class="carousel slide">
			  <!-- Carousel items -->
			  <div class="carousel-inner">
			    <div class="active item"><img src="img/s1.png"/></div>
			    <div class="item"><img src="img/s2.png"/></div>
			  </div>
			  <!-- Carousel nav -->
			  <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
			  <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
			</div>
      	</div>
      	<div class="span4">
      		<h2>New User?</h2>
          <h5>Register Here!</h5>
	        <form class="form">
			  
			    <div class="controls">
			      <input type="text" id="inputEmail" placeholder="First Name" class="input-xlarge">
			    </div>
			    <div class="controls">
			      <input type="text" id="inputEmail" placeholder="Last Name" class="input-xlarge">
			    </div>
			    <div class="controls">
			      <input type="text" id="inputEmail" placeholder="Email" class="input-xlarge">
			    </div>
			   	<div class="controls">
			      <input type="password" id="inputPassword" placeholder="Password" class="input-xlarge">
			    </div>
			    <div class="controls">
			      <input type="password" id="inputPassword" placeholder="Password" class="input-xlarge">
			    </div>
			    <div class="controls">
			      <input type="password" id="inputPassword" placeholder="Interests" class="input-xlarge">
			    </div>
			    <div class="controls">
			      <button type="submit" class="btn">Sign up</button>
			    </div>
			  </div>
			</form>
      </div>

      <!-- Example row of columns -->
      <div class="row">
        <div class="span6">
          <h2>Individual</h2>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
          <p><a class="btn" href="#">View details &raquo;</a></p>
        </div>
        <div class="span6">
          <h2>Corporate</h2>
          <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
          <p><a class="btn" href="#">View details &raquo;</a></p>
       </div>
  
      </div>

      <hr>

      <footer>
      </footer>

    </div> <!-- /container -->

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.js"></script>
   	<script type="text/javascript">
    	$('.carousel').carousel({
  			interval: 2000
		});
    </script>

  </body>
</html>
